﻿<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
    CodeBehind="Default.aspx.cs" Inherits="Lab9._Default" %>

<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <script type="text/javascript">

        function ajaxCall() {
            var query = document.forms['Form2']['txtSearch'].value;
            //var query = document.Form2.txtSearch.value;
            //alert(query);
            var xmlhttp = null;

            //alert("ready to make ajax call");
            if (window.XMLHttpRequest) {
                // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            }
            else {
                // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }

            var url = "ServerAjax.aspx?q=" + query;

            // This is not asynchronous (because of the "false").
            xmlhttp.open("GET", url, false);
            xmlhttp.send(null);

            // Not Asynchronous means it waits here until the reponse comes in.
            // alert("got a response");
            var editor = eval("(" + xmlhttp.responseText + ")");
            document.getElementById("editorName").innerHTML = editor.FullName;
            document.getElementById("editorDesc").innerHTML = editor.Description;
            document.getElementById("editorImg").src = editor.image;
        }
    
    </script>
    <form id="Form2" runat="server">
   <div style="margin: 5px 0 5px 20px">
    <p>Enter a character, word or phrase to search:</p>
    <input type="text" id="txtSearch" value="" />
    <input type="button" id="btnSearch" value="Search" onclick="ajaxCall();" />
       <div id="results">
       <h1> Search Results: <span style="font-size:small">(hint: try Notepad, Vim, Emacs, Visual Studio or Eclipse)</span></h1> 
        <h3>Name: &nbsp;</h3><span id="editorName"></span>
        <h3>Description: &nbsp; </h3><span id="editorDesc"></span>
        <h3>Image: &nbsp;</h3><img alt="" id="editorImg" src=""/>
           
       </div>
   </div>
   </form>
</asp:Content>
